import React, { Component } from 'react';
import InformationComponent from '../../Component/OrderManage/InformationComponent';
import Modal from '../../Component/CommonComponent/Modal'
import Empty from '../../Component/CommonComponent/Empty'
import Top from '../CommonComponent/Top'
import {AddressList,DefaultAddress,DelAddress} from '../../Action/auth';
import {Link} from 'react-router';

export default class ManageInformation extends Component {

    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            addressList : [],
            delAddress:false,
            addressId:''
           // isDefault : false
        };
    }

    componentWillMount() {
        this.getAddressList()
    }

    setDefaultAddress(id){
        DefaultAddress(id)
        .then(res=>{
            this.getAddressList()
            console.log('设置默认地址成功',res)
        })
        .catch(err=>{
            console.warn('设置默认地址失败',err)
        })

    }

    async getAddressList(){
        await AddressList()
            .then(res=>{
                const {resultList} = res
                this.setState({addressList:resultList})
            })
            .catch(err=>{
                console.warn('获取地址列表错误',err)
            })
    }

    //删除地址
    async DeleteAddress(){
        await DelAddress(this.state.addressId)
            .then(res=>{
               this.setState({delAddress:false})
                this.getAddressList()
            })
            .catch(err=>{
                console.warn('获取地址列表错误',err)
            })
    }

    render() {
        const {addressList} = this.state
        return (
            <div>
                <Top
                    title = {'地址管理'}
                />
                <div className="containerNav" style={{top:50}}>
                    {
                        addressList == ''?
                            <Empty />
                            :
                        addressList.map((el,index)=>{
                            return (
                                <div>
                                    <InformationComponent
                                        name={el.name}
                                        phone={el.mobile}
                                        path={(el.address?el.address:'')+(el.detail?el.detail:'')}
                                    />
                                    <div className="f12 flex flex-pack-justify flex-align-center border_bottom paddinglr color9" style={{height:40}}>
                                        <div className="height100 flex flex-align-center">
                                            <div className="posr" style={{marginRight:10}}>
                                                {
                                                    el.isDefault==0?
                                                        <span className="di" style={{width:20,height:20}}>
                                                            <img src = {require('../../Images/common/gou.png')}/>
                                                        </span>
                                                        :
                                                        <span
                                                            className="di bor999 border_ra50"
                                                            style={{width:20,height:20}}
                                                            onClick = {()=>this.setDefaultAddress(el.id)}
                                                        />
                                                }
                                            </div>
                                            <span>默认地址</span>
                                        </div>
                                        <div className="fr posr">
                                            <div className="di"
                                                 style={{width:56}}
                                                onClick={()=>this.setState({delAddress:true,addressId:el.id})}
                                            >
                                                <span className="di" style={{width:16,height:16,marginRight:5}}>
                                                    <img src={require('../../Images/common/detelename.png')} alt=""/>
                                                </span>
                                                <span className="di pa" style={{marginTop:2}}>删除</span>
                                            </div>
                                            <Link to = '/deliveredInformation' query={el} >
                                                <div className="di" style={{width:56}}>
                                                    <span className="di" style={{width:16,height:16,marginRight:5}}>
                                                        <img src={require('../../Images/common/modify.png')} alt=""/>
                                                    </span>
                                                    <span className="di pa color9" style={{marginTop:2}}>编辑</span>
                                                </div>
                                            </Link>
                                        </div>
                                    </div>
                                </div>
                            )
                        })
                    }
                    {
                        this.state.delAddress?
                            <Modal
                                title = {'确定删除浏览记录?'}
                                onClick = {()=>this.DeleteAddress()}
                                toHideModal={()=>this.setState({delAddress:false})}
                            />
                            :null
                    }
                </div>
            </div>
        );
    }
}
